<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>商城首页</title>
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
		<link rel="stylesheet" type="text/css" href="css/index_center.css"/>
		<script src="js/index.js" type="text/javascript" charset="utf-8"></script>
		
	</head>
	<body>
		<div id="container">
			<div id="header">
				<div id="header-top">
					<div id="logo">
						<a href="#"></a>
					</div>
					<div id="car">
						<ul>
							<li><a href="#" class="pic"></a></li>
							<li><a href="#" class="text">购物车</a></li>
							<li><a href="#" class="pic pic2"></a></li>
							<li><a href="#"  class="text">帮助中心</a></li>
							<li><a href="#" class="pic pic3"></a></li>
							<li><a href="#"  class="text">加入收藏</a></li>
							<li><a href="#" class="pic pic4"></a></li>
							<li><a href="#"  class="text">设为首页</a></li>
							<li><a href="http://127.0.0.1:8848/web/zhuce.html#" class="pic pic5">注册</a></li>
							<li><a href="#" class="pic pic5">登录</a></li>
						</ul>
					</div>
										<div id="welcome"
											<span>欢迎来到 </span>
											<span id="time">2020-09-25 17:15:00 </span>
										</div>
									</div>
				<div id="header-nav">
					<ul class="nav">
						<li><a href="#">首　　页</a></li>
						<li><a href="#">家用电器</a></li>
						<li><a href="#">手机数码</a></li>
						<li><a href="#">日用百货</a></li>
						<li><a href="#">书　　籍</a></li>
						<li><a href="#">帮助中心</a></li>
						<li><a href="#">全球资讯</a></li>
						<li><a href="#">免费开店</a></li>
					</ul>
					<ul class="soso">
						<li><input type="text" id="content" value="" /></li>
						<li><input type="button" onclick="soso()" id="" value="" /></li>
					</ul>
				</div>
				
				
			</div>
			<div id="center">
							<div id="center_left">
								<p class="space"></p>
								<!-- 左边的区域 -->
								<div class="content">
									<h3><a href="#">家用电器</a></h3>
									<ul>
										<li><a href="#">大家电</a></li>
										<li><a href="#">洗衣机</a></li>
										<li><a href="#">平板电视</a></li>
										<li><a href="#">电热水器</a></li>
										<li><a href="#">家庭音响</a></li>
										<li><a href="#">热水器</a></li>
										<li><a href="#">空调冰箱</a></li>
										<li><a href="#">冷柜</a></li>
										<li><a href="#">DVD</a></li>
										<li><a href="#">电视附件</a></li>
										<li><a href="#">电燃气灶</a></li>
										<li><a href="#">家电下乡</a></li>
										<li><a href="#">家电服务</a></li>
										<li><a href="#">电饭煲</a></li>
										<li><a href="#">摄像机</a></li>
									</ul>
								</div>
								
								<!-- 左边的区域 -->
								<div class="content">
									<h3><a href="#">手机数码</a></h3>
									<ul>
										<li><a href="#">大家电</a></li>
										<li><a href="#">洗衣机</a></li>
										<li><a href="#">平板电视</a></li>
										<li><a href="#">电热水器</a></li>
										<li><a href="#">家庭音响</a></li>
										<li><a href="#">热水器</a></li>
										<li><a href="#">空调冰箱</a></li>
										<li><a href="#">冷柜</a></li>
										<li><a href="#">DVD</a></li>
										<li><a href="#">电视附件</a></li>
										<li><a href="#">电燃气灶</a></li>
										<li><a href="#">家电下乡</a></li>
										<li><a href="#">家电服务</a></li>
										<li><a href="#">电饭煲</a></li>
										<li><a href="#">摄像机</a></li>
									</ul>
								</div>
								
								<!-- 左边的区域 -->
								<div class="content">
									<h3><a href="#">日用百货</a></h3>
									<ul>
										<li><a href="#">大家电</a></li>
										<li><a href="#">洗衣机</a></li>
										<li><a href="#">平板电视</a></li>
										<li><a href="#">电热水器</a></li>
										<li><a href="#">家庭音响</a></li>
										<li><a href="#">热水器</a></li>
										<li><a href="#">空调冰箱</a></li>
										<li><a href="#">冷柜</a></li>
										<li><a href="#">DVD</a></li>
										<li><a href="#">电视附件</a></li>
										<li><a href="#">电燃气灶</a></li>
										<li><a href="#">家电下乡</a></li>
										<li><a href="#">家电服务</a></li>
										<li><a href="#">电饭煲</a></li>
										<li><a href="#">摄像机</a></li>
									</ul>
								</div>
								
								<!-- 左边的区域 -->
								<div class="content">
									<h3><a href="#">书　　籍</a></h3>
									<ul>
										<li><a href="#">大家电</a></li>
										<li><a href="#">洗衣机</a></li>
										<li><a href="#">平板电视</a></li>
										<li><a href="#">电热水器</a></li>
										<li><a href="#">家庭音响</a></li>
										<li><a href="#">热水器</a></li>
										<li><a href="#">空调冰箱</a></li>
										<li><a href="#">冷柜</a></li>
										<li><a href="#">DVD</a></li>
										<li><a href="#">电视附件</a></li>
										<li><a href="#">电燃气灶</a></li>
										<li><a href="#">家电下乡</a></li>
										<li><a href="#">家电服务</a></li>
										<li><a href="#">电饭煲</a></li>
										<li><a href="#">摄像机</a></li>
									</ul>
								</div>
							</div>
							<div id="center_mid">
							<!-- 中间部分 -->
										     <div id="top-ad">
													<ul id="imgs">
														<li><a href="#"><img src="img/ad-02.jpg" alt=""></a></li>
														<li><a href="#"><img src="img/ad-01.jpg" alt=""></a></li>
														<li><a href="#"><img src="img/ad-03.jpg" alt=""></a></li>
														<li><a href="#"><img src="img/ad-04.jpg" alt=""></a></li>
													</ul>
													<ul class="num" id="nums">
														<li>1</li>
														<li>2</li>
														<li>3</li>
														<li>4</li>
													</ul>
												</div>
												<div id="creazy_bug">
													<ul>
														<li><a href=""><img src="img/promote-1.jpg" alt=""></a></li>
														<li><a href="">编程是一件很容易的事情，大家都可以学得很好</a></li>
													</ul>
													<ul>
														<li><a href=""><img src="img/promote-2.jpg" alt=""></a></li>
														<li><a href="">这是一个好商品，大家都要购买</a></li>
													</ul>
													<ul>
														<li><a href=""><img src="img/promote-3.jpg" alt=""></a></li>
														<li><a href="">只要花时间，就可以学得很好</a></li>
													</ul>
													<ul>
														<li><a href=""><img src="img/laser-pen.jpg" alt=""></a></li>
														<li><a href="">这是一个好商品，大家都要购买</a></li>
													</ul>
													<ul>
														<li><a href=""><img src="img/mouse.jpg" alt=""></a></li>
														<li><a href="">编程是一件很容易的事情，大家都可以学得很好</a></li>
													</ul>
													<ul>
														<li><a href=""><img src="img/earphone.jpg" alt=""></a></li>
														<li><a href="">只要花时间，就可以学得很好</a></li>
													</ul>
													<ul>
														<li><a href=""><img src="img/Wancom.jpg" alt=""></a></li>
														<li><a href="">只要花时间，就可以学得很好</a></li>
													</ul>
													<ul>
														<li><a href=""><img src="img/Frame.jpg" alt=""></a></li>
														<li><a href="">这是一个好商品，大家都要购买</a></li>
													</ul>
													<ul>
														<li><a href=""><img src="img/notebook.jpg" alt=""></a></li>
														<li><a href="">编程是一件很容易的事情，大家都可以学得很好</a></li>
													</ul>
													
												</div>
												
												
												
												
											</div>
											<div id="center_right">
															<!-- 右边 -->
															<div id="center_right_t">
																<!-- 顶部的div -->
																<div class="cover">
																	<ul>
																		<li><a href="#"><img src="img/1.png" alt=""></a></li>
																		<li><a href="#">大学要求学生认真听课</a></li>
																		<li><a href="#">大学要求学生有好成绩</a></li>
																		<li><a href="#">马上就要毕业</a></li>
																		<li><a href="#">找工作要有高技术</a></li>
																	</ul>
																</div>
															</div>
															<div id="center_right_m">
																<!-- 中间的div -->
																<ul>
																	<li><a href="#"><img src="img/show1.jpg" alt=""></a></li>
																	<li><a href="#">这是一个好产品,大促销</a></li>
																</ul>
																<ul>
																	<li><a href="#"><img src="img/show2.jpg" alt=""></a></li>
																	<li><a href="#">编写程序的电脑,写程序</a></li>
																</ul>
																<ul>
																	<li><a href="#"><img src="img/show3.jpg" alt=""></a></li>
																	<li><a href="#">适合女生的电脑颜值高</a></li>
																</ul>
																<ul>
																	<li><a href="#"><img src="img/show4.jpg" alt=""></a></li>
																	<li><a href="#">适合男生的电脑</a></li>
																</ul>
															</div>
															<div id="center_right_b">
																<!-- 底部的div -->
																<div id="center_right_b_t" class="computer">
																	<!-- 导航部分 -->
																	<ul>
																		<li onclick="showTab('computer')"></li>
																		<li onclick="showTab('phone')"></li>
																	</ul>
																</div>
																<div id="center_right_b_b">
																	<!-- 内容部分 -->
																	<div id="content_b">
																		<div id="computer" >
																			<form action="" method="">
																				<p>品牌：<select>
																				<option value="">联想</option>
																				<option value="">戴尔</option>
																				<option value="">华硕</option>
																				</select></p>
																				<p>尺寸：<select>
																				<option value="">14寸</option>
																				<option value="">15寸</option>
																				<option value="">16寸</option>
																				</select></p>
																				<p>价格：<select>
																				<option value="">4000以下</option>
																				<option value="">5000以下</option>
																				<option value="">6000以下</option>
																				</select></p>
																				<p id="bt"></p>
																			</form>
																		</div>
																		
																		<div id="phone" style="display: none;">
																			<form action="" method="">
																				<p>运营商：<select>
																				<option value="">联通</option>
																				<option value="">移动</option>
																				<option value="">电信</option>
																				</select></p>
																				<p>地　区：<select>
																				<option value="">广东</option>
																				<option value="">广西</option>
																				<option value="">河南</option>
																				</select></p>
																				<p>面　值：<select>
																				<option value="">50</option>
																				<option value="">100</option>
																				<option value="">200</option>
																				</select></p>
																				<p id="bt"></p>
																			</form>
																		</div>
																	</div>
																</div>
															</div>
														</div>
													</div>
											         <div id="con_2">
															    	<span>友情链接：</span>
																	<ul>
																		<li><a href="https://www.baidu.com/">百度</a></li>
																		<li><a href="https://baike.sogou.com/v65886.htm?fromTitle=%E8%B0%B7%E6%AD%8C">谷歌</a></li>
																		<li><a href="">迅雷</a></li>
																		<li><a href="">新浪微博</a></li>
																		<li><a href="">雅虎</a></li>
																		<li><a href="">淘宝</a></li>
																		<li><a href="">拍拍</a></li>
																		<li><a href="">易趣</a></li>
																		<li><a href="">当当</a></li>
																		<li><a href="">京东商城</a></li>
																		<li><a href="">网易搜狐</a></li>
																		<li><a href="">猫扑</a></li>
																		<li><a href="">开心网</a></li>
																		<li><a href="">猫扑</a></li>
																		<li><a href="">开心网</a></li>
																	</ul>
															    </div>
																<hr/>
																<div id="beian">
																	<span>COPYRIGHT C 2003-2010北京市贵美商城有限公司ALL RIGHTRESERVED</span>
																	<span>热线∶400-66-13060Email:service@prd.com</span>
																	<span>ICP:沪ICP备05021104号</span>
																</div>
																<div id="footer">
																	<ul>
																		<li><a href="https://www.alipay.com/"><img src="img/img1.gif" alt=""></a></li>
																		<li><a href="http://www.cfcp.cn/"><img src="img/img2.gif" alt=""></a></li>
																		<li><a href="http://315.edu.sina.com.cn/"><img src="img/img3.gif" alt=""></a></li>
																		<li><a href="http://www.cbcu.org.cn/website/index.jsp"><img src="img/img4.gif" alt=""></a></li>
																	</ul>
																</div>
															</div>
																</div>
																		<!-- 这是广告图片 使用绝对定位，相对于body -->
																		<!-- 左边 -->
																		<link rel="stylesheet" type="text/css" href="css/index_center.css"/>
																		<div id="ad_left">
																			<div>
																				<a href="#"><img src="img/list1.jpg"></a>
																				<img src="img/close.gif" onclick="hiddenAd('ad_left')"/>
																			</div>
																		</div>
																		<div id="ad_right">
																			<div>
																				<a href="#"><img src="img/list2.jpg"></a>
																				<img src="img/close.gif" onclick="hiddenAd('ad_right')"/>
																			</div>
																		</div>
																		
																	</body>
																</html>
																